<template>
  <div>
    <myheader></myheader>
    <navtable></navtable>
    <b class="line"></b>
    <div class="center" style="margin-top:0;">
      <div class="col-main">
        <div class="main-wrap">

          <div class="user-foot">
            <!--标题 -->
            <div class="am-cf am-padding">
              <div class="am-fl am-cf"><strong class="am-text-danger am-text-lg">我的足迹</strong> /
                <small>Browser&nbsp;History</small></div>
            </div>
            <hr />

            <!--足迹列表 -->

            <div class="goods" v-for="foot in foots">
              <!-- <div class="goods-date" style="padding-left:8px">
                <span><i class="date-desc">2012-12-11</i></span>
                <del class="am-icon-trash"></del>
                <s class="line"></s>
              </div> -->
              <div class="goods-box first-box">
                <div class="goods-pic">
                  <div class="goods-pic-box">
                    <a class="goods-pic-link" target="_blank" href="javascript:;;" v-on:click="toItem(foot.itemId)">
                      <img v-bind:src="foot.itemImg" class="goods-img"></a>
                  </div>
                  <a class="goods-delete" href="javascript:void(0);" v-on:click="delFoot(foot.id)"><i class="am-icon-trash"></i></a>
                  <div class="goods-status goods-status-show"><span class="desc" v-html="dateFormatter(foot.createTime)"></span></div>
                </div>

                <div class="goods-attr">
                  <div class="good-title">
                    <a class="title" href="#" target="_blank">{{foot.itemName}}</a>
                  </div>
                  <div class="goods-price">
                    <span class="g_price">
                      <span>¥</span><strong>{{foot.discountPrice==null?foot.sellingPrice:foot.discountPrice}}</strong>
                    </span>
                    <span class="g_price g_price-original">
                      <span>¥</span><strong>{{foot.sellingPrice}}</strong>
                    </span>
                  </div>
                  <div class="clear"></div>
                  <!-- <div class="goods-num">
                    <div class="match-recom">
                      <a href="#" class="match-recom-item">找相似</a>
                      <a href="#" class="match-recom-item">找搭配</a>
                      <i><em></em><span></span></i>
                    </div>
                  </div> -->
                </div>
              </div>
            </div>
            <div class="clear"></div>

          </div>
        </div>

        <!--底部-->
        <mfoot></mfoot>
      </div>
      <leftmenu></leftmenu>
      <!--左侧菜单导航栏 begin-->
      <navfull></navfull>
      <!--左侧菜单导航栏 end-->
    </div>
  </div>
</template>

<script>
import myheader from '@/components/myheader.vue'
import navfull from '@/components/navfull.vue'
import leftmenu from '@/components/leftmenu.vue'
import navtable from '@/components/navtable.vue'
import mfoot from '@/components/foot.vue'
export default {
  name: 'foot',
  data () {
    return {
      foots: ""
    }
  },
  components: {
    myheader,
    navfull,
    mfoot,
    leftmenu,
    navtable
  },
  mounted () {
    this.handler(1)
  },
  methods: {
    delFoot (id) {
      this.axios.delete("/item/ext/foot", {
        params: {
          id: id
        }
      }).then((res) => {
        var result = res.data;
        if (result.code == 200) {
          this.$layer.msg("删除成功")
        } else {
          this.$layer.msg((result.msg == null ? "删除失败" : result.msg))
        }
        this.handler(1)
      })
    },
    handler (index) {
      this.axios.get("/item/ext/foots", {
        params: {
          index: index,
          pageSize: 10
        }
      }).then((res) => {
        let result = res.data;
        if (result.code == 200) {
          this.foots = result.data;
        }else{
          this.foots = null
        }
      })
    },
    dateFormatter (date) {
      var time = new Date(date);
      var y = time.getFullYear();
      var m = time.getMonth() + 1;
      var d = time.getDate();
      var h = time.getHours();
      var mm = time.getMinutes();
      var s = time.getSeconds();
      return y + '-' + add0(m) + '-' + add0(d) + ' ' + add0(h) + ':' + add0(mm) + ':' + add0(s);
    },
    toItem (itemId) {
      this.$router.push({
        name: "item",
        query: {
          itemId: itemId
        }
      })
    }
  }
}
function add0 (m) {
  return m < 10 ? '0' + m : m
}
</script>

<style scoped>
@import "../../../AmazeUI-2.4.2/assets/css/admin.css";
@import "../../../AmazeUI-2.4.2/assets/css/amazeui.css";
@import "../../../assets/css/personal.css";
@import "../../../assets/css/footstyle.css";
</style>
